<template>
    <div style="height:100vh;overflow: hidden;">
        <fc-designer ref="designer">
            <template v-slot:handle>
                <ElButton type="primary" :v-loading="isPosting" @click="save">保存</ElButton>
            </template>
        </fc-designer>
    </div>
</template>

<script>

export default {
    data() {
        return {
            isPosting: false,
            surveyObj: undefined,
        }
    },
    created() {
        this.$store.dispatch("updateUser").then(() => {
            this.user = this.$store.state.user;
        });
        this.getSurvey()
    },
    mounted() {
        this.$refs.designer.removeMenuItem('fc-editor')
        this.$refs.designer.removeMenuItem('cascader')
        this.$refs.designer.removeMenuItem('upload')
        this.$refs.designer.removeMenuItem('tree')
        this.$refs.designer.removeMenuItem('el-transfer')
        this.$refs.designer.removeMenuItem('el-button')
    },
    methods: {
        getSurvey() {
            this.$request.get('/survey/' + this.getQueryVariable('survey_id')).then(resp => {
                // console.log(resp);
                if (!resp.success) {
                    return
                }
                this.surveyObj = resp.data
                let jsonContent = resp.data.surveyContent
                if (jsonContent != '' && jsonContent != null) {
                    this.$refs.designer.setRule(jsonContent)
                }
            })
        },
        save() {
            this.isPosting = true
            this.surveyObj.surveyContent = this.$refs.designer.getJson()
            this.$request.post('/survey/update', this.surveyObj).then(resp => {
                // console.log(resp);
                if (resp.success) {
                    this.$ElMessage({
                        message: "保存成功",
                        type: resp.success ? 'success' : 'error',
                    })
                    return
                }
            }).finally(() => this.isPosting = false)
        },
        getQueryVariable(variable) {
            var query = window.location.search.substring(1);
            var vars = query.split("&");
            for (var i = 0; i < vars.length; i++) {
                var pair = vars[i].split("=");
                if (pair[0] == variable) { return pair[1]; }
            }
            return (false);
        },
    },

}
</script>

<style>
* {
    box-sizing: border-box;
}
</style>